﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>在途</title>
    <link href="Scripts/bootstrap/css/bootstrap.css" rel="stylesheet" type="text/css" />
    <link href="Scripts/bootstrap/css/font-awesome.css" rel="stylesheet">
    <link href="Style/skin/css/style.css" rel="stylesheet" type="text/css" />
    <link href="Style/skin/css/animate.css" rel="stylesheet" type="text/css" />
    <link href="Style/skin/font/iconfont.css" rel="stylesheet" type="text/css" />
    <script src="Scripts/jquery-1.11.0.min.js" type="text/javascript"></script>
    <script src="Scripts/bootstrap/js/bootstrap.min.js"></script>
    <script src="Scripts/bootstrap/BootstrapUIDialog.js"></script>
    <script src="Scripts/jquery/jquery.easyui.min.js"></script>
    <script src="Scripts/jquery/jquery.cookie.js"></script>
    <link href="Scripts/jquery/themes/default/menu.css" rel="stylesheet" />
    <script src="Scripts/easyUI145/jquery.easyui.min.js" type="text/javascript"></script>
    <script src="Scripts/EasyUIUtility.js" type="text/javascript"></script>
    <script src=" Scripts/config.js" type="text/javascript"></script>
    <script src=" Comm/Gener.js" type="text/javascript"></script>
    <script src=" Scripts/Cookie.js" type="text/javascript"></script>
    <script src=" Scripts/QueryString.js" type="text/javascript"></script>
    <!-- 处理多语言 -->
    <script src="Data/lang/load.js" type="text/javascript"></script>
    <style id="theme-data"></style>
    <style type="text/css">
        * {
            list-style: none;
        }

        .wrapper-dropdown-2 {
            /* Size and position */
            position: relative; /* Enable absolute positionning for children and pseudo elements */
            width: 80px;
            margin: 0 auto;
            margin-left: 0px;
            padding: 10px 15px;
            /* Styles */
            background: #fff;
            border-left: 5px solid grey;
            cursor: pointer;
            outline: none;
        }

            .wrapper-dropdown-2:after {
                content: "";
                width: 0;
                height: 0;
                position: absolute;
                right: 16px;
                top: 50%;
                margin-top: -3px;
                border-width: 6px 6px 0 6px;
                border-style: solid;
                border-color: grey transparent;
            }

            .wrapper-dropdown-2 .dropdown {
                /* Size & position */
                position: absolute;
                z-index: 100;
                top: 100%;
                left: -5px;
                right: 0px;
                /* Styles */
                background: white;
                -webkit-transition: all 0.3s ease-out;
                -moz-transition: all 0.3s ease-out;
                -ms-transition: all 0.3s ease-out;
                -o-transition: all 0.3s ease-out;
                transition: all 0.3s ease-out;
                list-style: none;
                /* Hiding */
                opacity: 0;
                pointer-events: none;
            }

                .wrapper-dropdown-2 .dropdown li a {
                    list-style: none;
                    display: block;
                    text-decoration: none;
                    color: #333;
                    border-left: 5px solid;
                    padding: 9px;
                    -webkit-transition: all 0.3s ease-out;
                    -moz-transition: all 0.3s ease-out;
                    -ms-transition: all 0.3s ease-out;
                    -o-transition: all 0.3s ease-out;
                    transition: all 0.3s ease-out;
                }

                .wrapper-dropdown-2 .dropdown li:nth-child(1) a {
                    border-left-color: #00ACED;
                }

                .wrapper-dropdown-2 .dropdown li:nth-child(2) a {
                    border-left-color: #4183C4;
                }

                .wrapper-dropdown-2 .dropdown li:nth-child(3) a {
                    border-left-color: #3B5998;
                }



                /* Hover state */

                .wrapper-dropdown-2 .dropdown li:hover a {
                    color: grey;
                    list-style: none;
                }

            /* Active state */



            .wrapper-dropdown-2.active .dropdown {
                opacity: 1;
                pointer-events: auto;
                list-style: none;
            }

        .pagination {
            margin: 8px 0;
            display: block;
            font-size: 13px;
        }

            .pagination .controls {
                float: left;
                border: 0;
                padding: 7px 0 0 15px;
                color: #777;
            }

        .search-padding {
            padding-bottom: 1px;
        }

        .row {
            margin-right: -15px;
            margin-left: 0px;
        }

        .table {
            width: 100%;
            max-width: 100%;
            margin-bottom: 0px;
            table-layout: fixed;
        }

        .tdHidden {
            word-break: keep-all; /* 不换行 */
            white-space: nowrap; /* 不换行 */
            overflow: hidden; /* 内容超出宽度时隐藏超出部分的内容 */
            text-overflow: ellipsis; /* 当对象内文本溢出时显示省略标记(...) ；需与overflow:hidden;一起使用*/
            -o-text-overflow: ellipsis;
            -icab-text-overflow: ellipsis;
            -khtml-text-overflow: ellipsis;
            -moz-text-overflow: ellipsis;
            -webkit-text-overflow: ellipsis;
        }

        .btn-sm {
            padding: 0 10px;
            height: 26px;
            line-height: 26px;
            border-radius: 5px;
            font-size: 14px;
        }
    </style>
</head>
<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="ibox-content">
            <div class="row search-padding">
                <div class="col-md-4 col-sm-4 pull-left">
                    <div class="form-inline" style="width:600px;">
                        <div class="form-group">
                            <input type='text' placeholder="请输入关键词..." id='TB_Key' class="form-control" style="width:300px;" />
                        </div>
                        <button class="btn btn-success btn-sm" type="button" onclick="javascript:SearchKey();"><i class="fa fa-search"></i>查询</button>
                    </div>
                </div>
            </div>
            <table class="table  table-striped">
                <thead id="threadDiv">
                </thead>
                <tbody id="Table1"></tbody>
            </table>

            <!-- 显示分页信息 -->
            <div class="row" style="text-align: left;">
                <ul class="pagination" id="page_nav">
                </ul>
                <ul class="pagination controls" id="page_info">
                </ul>
                <div style="clear: both;"></div>
            </div>
        </div>
    </div>
    <script language="JavaScript" src="./Comm/JScript.js" type="text/javascript"></script>
    <script type="text/javascript" src="./Scripts/bootstrap/js/jquery.min.js"></script>
    <script type="text/javascript" src="./Scripts/bootstrap/js/bootstrap.min.js"></script>
    <script src="Scripts/bootstrap/bootstrap-paginator/js/bootstrap-paginator.js" type="text/javascript"></script>
    <script src="./Scripts/QueryString.js" type="text/javascript"></script>
    <script src="./Scripts/config.js" type="text/javascript"></script>
    <script src="Comm/Gener.js" type="text/javascript"></script>
    <script src="Scripts/layui/layui/lay/modules/layer.js" type="text/javascript"></script>
    <script language="javascript" type="text/javascript">

        /**
         *  为什么写到这里？ Gener.js 是一个与其他任何业务模块无关的js文件.
         * 执行跳转到MyFlow/MyView页面的判断方法:
         * @param {any} title
         * @param {any} workid
         * @param {any} fk_flow
         * @param {any} fk_node
         * @param {any} fid
         * @param {any} pworkid
         */
        function JumpFlowPage(pageType, title, workid, fk_flow, fk_node, fid, pworkid, isread, paras) {
            var handler = new HttpHandler("BP.WF.HttpHandler.WF_MyFlow");
            if (pageType == "MyView")
                handler = new HttpHandler("BP.WF.HttpHandler.WF_MyView");

            if (workid != null && workid != undefined)
                handler.AddPara("WorkID", workid);
            handler.AddPara("FK_Flow", fk_flow);
            if (fk_node != null && fk_node != undefined)
                handler.AddPara("FK_Node", fk_node);
            if (fid != null && fid != undefined)
                handler.AddPara("FID", fid);
            if (pworkid != null && pworkid != undefined)
                handler.AddPara("PWorkID", pworkid);
            if (isread != null && isread != undefined)
                handler.AddPara("IsRead", isread);
            if (paras != null && paras != undefined)
                handler.AddPara("Paras", paras);


            var data = "";
            if (pageType == "MyView")
                data = handler.DoMethodReturnString("MyView_Init");
            else
                data = handler.DoMethodReturnString("MyFlow_Init");

            if (data.indexOf('err@') == 0) {
                alert(data);
                return;
            }

            if (data.indexOf('url@') == 0) {

                data = data.replace('url@', ''); //如果返回url，就直接转向.
                data = data.replace('?DoType=HttpHandler', '?');
                data = data.replace('&DoType=HttpHandler', '');
                data = data.replace('&DoMethod=MyFlow_Init', '');
                data = data.replace('&HttpHandlerName=BP.WF.HttpHandler.WF_MyFlow', '');
                data = data.replace('?&', '?');
                var url = data;
                url = url.replace('/WF//WF/', '/WF/');
                if (url.indexOf("http") == -1) {
                    if (url.indexOf('/WF/') == -1)
                        url = '/WF/' + url;
                    url = basePath + url;
                }
                try {
                    if (window.top.vm != undefined) {
                        window.top.vm.openTab(title, url);
                        return;
                    }
                    window.open(url); //打开流程.
                } catch (e) {
                    data = data.replace('/WF//WF/', '/WF/');
                    window.open(data); //打开流程.
                    return;
                }
            }
        }
        function GroupBarClick(groupName) {

            var alt = document.getElementById('Img' + groupName).alert;
            var sta = 'block';
            if (alt == 'Max') {
                sta = 'block';
                alt = 'Min';
                classname = 'fa fa-minus-square';
            } else {
                sta = 'none';
                alt = 'Max';
                classname = 'fa  fa-plus-square';
            }

            document.getElementById('Img' + groupName).className = classname;
            document.getElementById('Img' + groupName).alert = alt;

            var i = 0;
            for (i = 0; i <= 600; i++) {

                var row = document.getElementById(groupName + i);

                if (row == null || row == undefined || row.style == null)
                    continue;

                if (sta == 'block') {
                    row.style.display = '';
                } else {
                    row.style.display = sta;
                }
            }
        }

        // 撤销。
        function UnSend(fk_flow, workid, fid, unSendToNode) {

            if (window.confirm('您确定要撤销本次发送吗？') == false)
                return;

            var handler = new HttpHandler("BP.WF.HttpHandler.WF");
            handler.AddPara("FK_Flow", fk_flow);
            handler.AddPara("WorkID", workid);
            handler.AddPara("FID", fid);
            handler.AddPara("UnSendToNode", unSendToNode);
            var data = handler.DoMethodReturnString("Runing_UnSend");

            if (data.indexOf('err@') == 0) {
                alert(data);
                return;
            }

            $("#Msg").html(data + " <br> @点击这里<a href='javascript:Reload();' >刷新</a>");
            if (data.indexOf("KillSubThared") == 0) {
                alert(data.replace("KillSubThared@", ""));
                return;
            }
            alert(data);
            var url = 'MyFlow.htm?FK_Flow=' + fk_flow + '&WorkID=' + workid + '&FID=' + fid;
            window.open(url);
            Reload();
            return;
        }

        //催办.
        function Press(fk_flow, workid, fid) {

            var msg = promptGener('请输入催办信息', '该工作因为xxx原因，需要您优先处理.');
            if (msg == null)
                return;

            var handler = new HttpHandler("BP.WF.HttpHandler.WF");
            handler.AddPara("FK_Flow", fk_flow);
            handler.AddPara("WorkID", workid);
            handler.AddPara("FID", fid);
            handler.AddPara("Msg", msg);
            var data = handler.DoMethodReturnString("Runing_Press");

            if (data.indexOf('err@') == 0) {
                alert(data);
                return;
            }

            alert(data);
            return;
        }

        function WinOpenIt(workid, nodeID, flowNo, fid, currNodeId) {

            //但前节点所处的位置
            var nowNode = new Entity("BP.WF.Node", nodeID);

            //如果是树形表单，则显示当前人所处节点的数据
            if (nowNode.FormType == 5) {
                //获取人员所处的流程节点

                var currNode = new Entity("BP.WF.Node", currNodeId);
                if (currNode.HisToNDs.indexOf(nodeID) == -1) {
                    if ((currNode.RunModel == RunModel.HL || currNode.RunModel == RunModel.FHL || currNode.RunModel == RunModel.FL) && (fid != 0)) {
                        workID = fid;
                        fid = 0;
                        nodeID = currNodeId;
                    }
                } else {
                    //判断当前节点的运行模式
                    if ((currNode.RunModel == RunModel.HL || currNode.RunModel == RunModel.FHL || currNode.RunModel == RunModel.FL) && nowNode.RunModel == RunModel.SubThread) {
                        workID = fid;
                        fid = 0;
                        nodeID = currNodeId;
                    } else if (currNode.RunModel == RunModel.SubThread) {
                        nodeID = currNodeId;
                    }
                }


            }
            var url = "WFRpt.htm?FK_Flow=" + flowNo + "&WorkID=" + workid + "&FK_Node=" + nodeID + "&FID=" + fid + "&IsRead=0";
            layer.open({
                skin: 'layer-class',
                type: 2,
                title: '在途',
                area: ['96%', '90%'],
                content: url
            });
        }

        /* ESC Key Down */
        function Esc() {
            if (event.keyCode == 27)
                window.close();
            return true;
        }

        /* 打开表单. */
        function OpenFrm(workid, nodeID, flowNo, fid, title) {
            JumpFlowPage("MyView", title, workid, flowNo, nodeID, fid);
            return;
        }

        var pageCount = 1;
        var pageSize = 10;
        var total = 0;
        var pageIdx = 1;
        var pageStartN = 1;
        var realCount = 0;
        var groupNames = [];
        //页面启动函数.
        $(function () {
            var _html = `<tr>
                                <th width="40">${window.lang.xu}</th>
                                <th style="width:35%;">${window.lang.biaoti}</th>
                                <th width="60">${window.lang.fqr}</th>
                                <th width="200">${window.lang.fqbm}</th>
                                <th>${window.lang.dqjd}</th>
                                <th width="120">${window.lang.sdrq}</th>
                                <th width="150">${window.lang.dqclr}</th>
                            </tr>`;
            $("#threadDiv").html(_html);
            InitPage();
            Paginator(pageCount, pageIdx);

            $(".tdHidden").on("mouseover", function () {
                if (this.offsetWidth < this.scrollWidth) {
                    var that = this;
                    var text = $(this).text();
                    layer.tips(text, that, {
                        tips: 1,
                        area: [this.offsetWidth + 'px', 'auto'],
                        time: 0
                    });
                }
            });
            $(".tdHidden").on("mouseout", function () {
                layer.closeAll();
            });
        });

        function GetRuningData(pageIdex) {
            //获取参数，FlowNos，为空时显示所有的待办，否则显示参数中的流程
            var flowNos = GetQueryString("FlowNos");
            if (flowNos == null || flowNos == "" || flowNos == undefined)
                flowNos = null;
            //查询
            var TB_Key = $("#TB_Key").val();

            var handler = new HttpHandler("BP.WF.HttpHandler.WF");
            handler.AddPara("IsContainFuture", isContainFuture);
            var data = handler.DoMethodReturnString("Runing_Init");

            if (data.indexOf('err@') == 0) {
                alert(data);
            }
            data = JSON.parse(data);

            realCount = data.length;
            if (flowNos != null) {
                realCount = 0;
                for (var i = 0; i < data.length; i++) {
                    if (flowNos.indexOf(data[i].FK_Flow) != -1)
                        realCount++;
                }
            }


            var sourceData;
            //获取在途总的查询信息

            //1.流程编号和查询组件为空时
            if (flowNos == null && TB_Key == "")
                sourceData = data;
            //2.流程编号不为空和查询组件为空时
            if (flowNos != null && TB_Key == "")
                sourceData = $.grep(data, function (n, i) {
                    return (flowNos.indexOf(data[i].FK_Flow) != -1);
                });
            //3.流程编号为空和查询组件不为空时
            if (flowNos == null && TB_Key != "")
                sourceData = $.grep(data, function (n, i) {
                    return (data[i].Title.indexOf(TB_Key) != -1);
                });
            //4.流程编号为不空和查询组件不为空时
            if (flowNos != null && TB_Key != "")
                sourceData = $.grep(data, function (n, i) {
                    return (flowNos.indexOf(data[i].FK_Flow) != -1) && (data[i].Title.indexOf(TB_Key) != -1);
                });

            //生成分组的字符串.
            var str = "@";
            for (var i = 0; i < sourceData.length; i++) {
                if (str.indexOf('@' + sourceData[i].FlowName + "@") == -1) {
                    if (flowNos == null || (flowNos != null && flowNos.indexOf(sourceData[i].FK_Flow) != -1))
                        str += sourceData[i].FlowName + "@";
                }

            }
            groupNames = str.split("@"); //生成数组.

            //总数
            total = sourceData.length;
            //获取分页的数据信息
            data = [];
            pageStartN = (pageIdx - 1) < 0 ? 1 : (pageIdx - 1) * pageSize;
            pageEndN = pageIdx * pageSize > total ? total : pageIdx * pageSize;
            for (var i = pageStartN; i < pageEndN; i++) {
                data.push(sourceData[i]);
            }

            //总页数
            if (total % pageSize != 0)
                pageCount = parseInt(total / pageSize) + 1;
            else
                pageCount = parseInt(total / pageSize);
            if (pageCount == 0) pageCount = 1;

            var div = window.parent.document.getElementById("Todolist_Runing");
            if (div != null) {
                div.innerHTML = realCount;
            }

            return data;

        }
        var RunModel = { "Ordinary": 0, "HL": 1, "FL": 2, "FHL": 3, "SubThread": 4 };
        var isContainFuture = GetQueryString("IsContainFuture");
        if (isContainFuture == null || isContainFuture == undefined || isContainFuture == "")
            isContainFuture = "0";
        //初始化数据.
        function InitPage() {
            var data = GetRuningData(pageIdx);
            var is1 = false;
            var num = pageStartN;
            //随机串.
            var timeKey = Math.random();
            $('#Table1').html("");
            for (var idx = 0; idx < groupNames.length; idx++) {
                var showRealCount = 0;
                var listbox = '';
                var groupName = groupNames[idx];
                if (groupName == "" || groupName == null)
                    continue;

                listbox += "<tr  onclick=\"GroupBarClick('" + groupName + "')\" > <th colspan=7 class='table-title'> <i class='fa fa-minus-square' alert='Min'  id='Img" + groupName + "'></i><span>" + groupName + "</span></th> </tr>";
                //增加处理.
                for (var i = 0; i < data.length; i++) {

                    var work = data[i];
                    if (work.FlowName != groupName)
                        continue;

                    num++;
                    showRealCount++;
                    if (is1 == true) {
                        listbox += "<tr  id='" + groupName + num + "' >";
                        is1 = false;
                    } else {
                        listbox += "<tr  id='" + groupName + num + "' >";
                        is1 = true;
                    }

                    listbox += "<td>" + num + "</td>";
                    listbox += "<td><a href=\"javascript:OpenFrm('" + work.WorkID + "','" + work.FK_Node + "','" + work.FK_Flow + "','" + work.FID + "','" + work.FlowName + "')\" >" + work.Title + "</a></td>";
                    listbox += "<td>" + work.StarterName + "</td>";
                    listbox += "<td>" + work.DeptName + "</td>";
                    listbox += "<td>" + work.NodeName + "</td>";
                    listbox += "<td>" + work.RDT + "</td>";

                    var todoEmps = work.TodoEmps;

                    if (todoEmps.indexOf(',') != -1)
                        todoEmps = todoEmps.substring(todoEmps.indexOf(',') + 1);

                    listbox += "<td class='tdHidden'>" + todoEmps + "</td>";



                    listbox += "</tr>";
                }
                if (showRealCount != 0)
                    $('#Table1').append(listbox);

            }


        }
        function DropDown(el) {
            this.dd = el;
            this.initEvents();
        }
        DropDown.prototype = {
            initEvents: function () {
                var obj = this;

                obj.dd.on('click', function (event) {
                    $(this).toggleClass('active');
                    event.stopPropagation();
                });
            }
        }

        $(function () {
            $(".wrapper-dropdown-2").on("mousedown", function (e) {
                var v_id = $(e.target).attr("id");
                var dd = new DropDown($("#" + v_id + ""));
            });

            $(".wrapper-dropdown-2").click(function () {
                // all dropdowns
                $('.wrapper-dropdown-2').removeClass('active');
            });
            $(document).click(function () {
                // all dropdowns
                $('.wrapper-dropdown-2').removeClass('active');
            });

        });
        //撤销抄送
        function UnSendCC(fk_flow, workid, fid, unSendToNode) {
            var url = "./WorkOpt/CCListUnSend.htm?WorkID=" + workid + "&FK_Flow=" + fk_flow + "&FK_Node=" + unSendToNode + "&FID=" + fid;
            var W = document.body.clientWidth - 300;
            var H = document.body.clientHeight - 140;
            OpenBootStrapModal(url, "CC", "抄送信息", W, H);
            return;
            if (window.confirm('您确定要撤销本次抄送吗？') == false)
                return;

            var handler = new HttpHandler("BP.WF.HttpHandler.WF");
            handler.AddPara("FK_Flow", fk_flow);
            handler.AddPara("WorkID", workid);
            handler.AddPara("FID", fid);
            handler.AddPara("UnSendToNode", unSendToNode);
            var data = handler.DoMethodReturnString("Runing_UnSendCC");

            if (data.indexOf('err@') == 0) {
                alert(data);
                return;
            }

            $("#Msg").html(data + " <br> @点击这里<a href='javascript:Reload();' >刷新</a>");
            if (data.indexOf("KillSubThared") == 0) {
                alert(data.replace("KillSubThared@", ""));
                return;
            }
            alert(data);
            var url = 'MyFlow.htm?FK_Flow=' + fk_flow + '&WorkID=' + workid + '&FID=' + fid;
            window.open(url);

            return;
        }

        //查询
        function SearchKey() {
            pageIdex = 1;
            InitPage();
            Paginator(pageCount, pageIdx);
        }

        //分页功能
        function Paginator(pageCount, currentPage) {
            var pageCount = pageCount; //取到pageCount的值(把返回数据转成object类型)
            var options = {
                bootstrapMajorVersion: 3, //版本
                currentPage: currentPage, //当前页数
                totalPages: pageCount, //总页数
                shouldShowPage: true, //是否显示该按钮
                itemTexts: function (type, page, current) {
                    switch (type) {
                        case "first":
                            return window.lang.shouye;
                        case "prev":
                            return window.lang.shangyiye;
                        case "next":
                            return window.lang.xiayiye;
                        case "last":
                            return window.lang.moye;
                        case "page":
                            return page;
                    }
                }, //点击事件，用于通过Ajax来刷新整个list列表
                onPageClicked: function (event, originalEvent, type, page) {
                    pageIdx = page;
                    InitPage(page);
                    $('#page_info').html("").append(`<li class='disabled controls'>${window.lang.danqian} ${pageIdx} ${window.lang.ye}，${window.lang.zonggong} ${pageCount}
                                ${window.lang.ye},${window.lang.zonggong} ${total} ${window.lang.record}。</li>`);
                }
            };
            $('#page_nav').bootstrapPaginator(options);
            $('#page_info').html("").append(`<li class='disabled controls'>${window.lang.danqian} ${pageIdx} ${window.lang.ye}，${window.lang.zonggong} ${pageCount}
                        ${window.lang.ye},${window.lang.zonggong} ${total} ${window.lang.record}。</li>`);

        }
    </script>
    <script>
        $(function () {
            if (CustomerNo != "" && CustomerNo != null) {
                var html = styleScope.innerHTML;
                html += "\n .btn{\n background-color:'#5053f1';\n}\n.btn-success:hover{\n background-color:'#5053f1';\n}\n.btn-success:focus{\n background-color:'#5053f1';\n}\n.btn-success:active{\n background-color:'#5053f1';\n}\n.btn-success:active:focus{\n background-color:'#5053f1';border-color:'#5053f1'; \n}";
                styleScope.innerHTML = filterXSS(html);
            }
            var theme = filterXSS(localStorage.getItem("themeColorInfo"));
            if (theme == 'undefined' || theme == "" || theme == null)
                return;
            var data = JSON.parse(theme);
            var styleScope = document.getElementById("theme-data");
            var html = styleScope.innerHTML;
            html += "\n .btn{\n background-color:" + data.selectedMenu + ";\n}\n.btn-success:hover{\n background-color:" + data.selectedMenu + ";\n}\n.btn-success:focus{\n background-color:" + data.selectedMenu + ";\n}\n.btn-success:active{\n background-color:" + data.selectedMenu + ";\n}\n.btn-success:active:focus{\n background-color:" + data.selectedMenu + ";border-color:" + data.selectedMenu + "; \n}";
            styleScope.innerHTML = filterXSS(html);
        })
    </script>
</body>

</html>